<!--
 * @Author: GuoShuning
 * @Date: 2022-12-14 11:02:44
 * @LastEditors: GuoShuning
 * @LastEditTime: 2022-12-17 11:32:40
 * @Description: 
-->
<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <script src="./common/bootstrap-5.2.3-dist/js/bootstrap.bundle.js"></script>
  <link rel="stylesheet" href="./common/css/coommon.css">
  <title>登录</title>
</head>

<body>
  <div class="loginPage">
    <div class="loginLeft">
      <div class="copyRight">
        <div>帮助&#12288;&#12288;&#12288;隐私&#12288;&#12288;&#12288;条款</div>
        <div>Copyrights© 2022 杭州聚达物联科技有限公司出品</div>
      </div>
    </div>
    <div class="loginRight">
      <img src="./common/img/login/logo.png" width="386px" height="64px" alt="">
      <div class="tabs">
        <ul class="nav nav-tabs" id="myTab" role="tablist">
          <li class="nav-item" role="presentation">
            <button class="nav-link active" id="home-tab" data-bs-toggle="tab" data-bs-target="#home-tab-pane"
              type="button" role="tab" aria-controls="home-tab-pane" aria-selected="true">账户密码登录</button>
          </li>
          <li class="nav-item" role="presentation">
            <button class="nav-link" id="profile-tab" data-bs-toggle="tab" data-bs-target="#profile-tab-pane"
              type="button" role="tab" aria-controls="profile-tab-pane" aria-selected="false">手机号登录</button>
          </li>
        </ul>
        <div class="tab-content myTabContent" id="myTabContent">
          <div class="tab-pane fade show active" id="home-tab-pane" role="tabpanel" aria-labelledby="home-tab"
            tabindex="0">
            <div class="itemInput">
              <input type="text" placeholder="请输入账号">
            </div>
            <div class="itemInput">
              <input type="password" placeholder="请输入密码">
            </div>
            <div class="itemInput codeInput">
              <input type="text" maxlength="4" placeholder="请输入验证码">
              <img class="codeImg" width="188px" height="72px" src="" alt="">
            </div>
            <div class="forgot">
              忘记密码？
            </div>
          </div>
          <div class="tab-pane fade myTabContent" id="profile-tab-pane" role="tabpanel" aria-labelledby="profile-tab"
            tabindex="0">
            <div class="itemInput phoneInput">
              <div class="prev">+86</div>
              <input type="text" placeholder="请输入账号">
            </div>
            <div class="itemInput pwdInput">
              <input type="password" placeholder="请输入密码">
              <div class="getCode">获取验证码</div>
            </div>
            <div class="savePwd">
              <div class="leftSave">
                <input type="checkbox" name="autoLogin" id="autoLogin">自动登录
              </div>
              <div class="forgot">
                忘记密码?
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="login">登 录</div>
    </div>
  </div>
  </div>
</body>

</html>